import { Popup, DatetimePicker, Picker } from "vant";
// import Hybrid from "@/components/uzone-hybrid";
import keyMap from "@/config/key-map";
import dateFormat from "@/libs/filters/format-date";
import UploadImage from "@/components/upload-image";
import {
  validateName,
  validateUMID1,
  validateUMID2,
  validateUMID3,
  validatePassport2,
  validateTINID1,
  validateTINID2,
  validateDriver1,
  validateDriver2,
  validateDriver3,
  validateSSSID1,
  validateSSSID2,
  validateSSSID3,
  validatePostalID1,
  validatePostalID2,
  validateVoterID1,
  validateVoterID2,
  validateVoterID3,
  validatePRCID,
  validateGSUSID,
  validateOWWAID1,
  validateOWWAID2,
  validateNationalID,
  validatePhilhealthID1,
  validatePhilhealthID2,
  validatePhilhealthID3,
} from "@/libs/validate";
import MixinValidateForm from "@/service/mixin-validate-form";
import NavBar from "../components/navBar1";
import doFaceButton from "@/components/doFaceButton";

export default {
  name: "identity-information",
  components: {
    doFaceButton,
    NavBar,
    Popup,
    DatetimePicker,
    Picker,
    UploadImage,
  },
  mixins: [MixinValidateForm],
  data() {
    return {
      pageTrackerInfo: {
        page: 'basicInfo',
        startTime: new Date().getTime()
      },
      productId: "",
      readonly: false,
      instalment: false,
      oldPhone: "",
      newOldPhone: "",
      isChangePhone: false,
      form: {
        identificationType: "", // 证件类型
        identificationId: "", // 证件类型编号
        cardId: "", // 证件号码

        cardId_UMID_1: "",
        cardId_UMID_2: "",
        cardId_UMID_3: "",

        cardId_Passport: "",

        cardId_TINID_1: "",
        cardId_TINID_2: "",
        cardId_TINID_3: "",
        cardId_TINID_4: "",

        cardId_Driver_1: "",
        cardId_Driver_2: "",
        cardId_Driver_3: "",

        cardId_SSSID_1: "",
        cardId_SSSID_2: "",
        cardId_SSSID_3: "",

        cardId_Postal_1: "",
        cardId_Postal_2: "",

        cardId_Voter_1: "",
        cardId_Voter_2: "",
        cardId_Voter_3: "",

        cardId_PRC: "",

        cardId_GSIS: "",

        cardId_OWWA_1: "",
        cardId_OWWA_2: "",

        cardId_National_1: "",
        cardId_National_2: "",
        cardId_National_3: "",
        cardId_National_4: "",

        cardId_Philhealth_1: "",
        cardId_Philhealth_2: "",
        cardId_Philhealth_3: "",

        cardId1: "",
        cardId2: "",
        cardId3: "",
        cardId4: "",
        cardId5: "",
        firstName: "",
        middleName: "",
        lastName: "",
        // birthDay: new Date('Sun Jan 01 1990 00:00:00 GMT+0800 (中国标准时间)'),
        birthDay: "",
        birthDayForSubmit: "",
        sex: "",
        cardPositiveImg: "", // 证件照
        cardImg: "", // 手持证件照
      },
      // birthDayStr: '',
      status: {
        identity: null,
        personal: null,
        work: null,
        contact: null,
        additional: null,
      },
      iDTypeData: keyMap.iDType,
      isVisibleIDTypePicker: false,
      isVisibleIDTypePickerP: false,
      isVisibleBirthdayPicker: false,
      maxDate: new Date(),
      minDate: new Date(1950, 0, 1),
      btnName: this.$t("next"),
      disabledBtn: false,
      birthdayData: [
        {
          values: [
            "01",
            "02",
            "03",
            "04",
            "05",
            "06",
            "07",
            "08",
            "09",
            "10",
            "11",
            "12",
          ],
          className: "column1",
        },
        {
          values: [
            "01",
            "02",
            "03",
            "04",
            "05",
            "06",
            "07",
            "08",
            "09",
            "10",
            "11",
            "12",
            "13",
            "14",
            "15",
            "16",
            "17",
            "18",
            "19",
            "20",
            "21",
            "22",
            "23",
            "24",
            "25",
            "26",
            "27",
            "28",
            "29",
            "30",
            "31",
          ],
          className: "column2",
        },
      ],
    };
  },
  computed: {
    btnCanSubmit() {
      const {
        identificationType,
        firstName,
        lastName,
        middleName,
        birthDay,
        sex,
      } = this.form;
      return (
        !identificationType ||
        !firstName ||
        !lastName ||
        !middleName ||
        !birthDay ||
        !sex
      );
    },
    nameLabel() {
      const type = this.form.identificationType;
      switch (type) {
        case "UMID (Unified Multi-Purpose ID)":
          return "UMID";
        case "TIN ID (Taxpayer Identification Number)":
          return "TIN ID";
        case "SSS ID (Social Security System)":
          return "SSS ID";
        case "PRC ID (Professional Regulation Commission)":
          return "PRC ID";
        case "OWWA ID (Overseas Workers Welfare Administration)":
          return "OWWA ID";
        default:
          return type;
      }
    },
    currentIdentificationId() {
      const iDType = this.iDTypeData.filter(
        (item) => item.IdentificationType === this.form.identificationType
      );
      return iDType[0].IdentificationId;
    },
  },
  methods: {
    /**
     * 显示证件类型选择框
     */
    showIDTypePicker() {
      this.isVisibleIDTypePickerP = true;
      // 基础信息页证件类型点击
      this.$buryPoint.action({
        eventName: 'basicInfo_IDType_click',
        ...this.pageTrackerInfo
      });
      setTimeout(() => {
        const nextTipsDiv = this.$refs["error-tips-idCard"];
        if (nextTipsDiv && nextTipsDiv.className === "error-tips") {
          nextTipsDiv.style.display = "none";
          nextTipsDiv.textContent = null;
        }
        this.isVisibleIDTypePicker = true;
      }, 100);
    },
    /**
     * 选择证件类型
     */
    chooseIDType(val) {
      if (
        this.form.identificationType !== val.IdentificationType &&
        this.form.identificationType !== ""
      ) {
        this.form.cardId = "";
        this.form.cardId1 = "";
        this.form.cardId2 = "";
        this.form.cardId3 = "";
        this.form.cardId4 = "";
        this.form.cardId5 = "";

        this.form.cardId_UMID_1 = "";
        this.form.cardId_UMID_2 = "";
        this.form.cardId_UMID_3 = "";
        this.form.cardId_Passport = "";
        this.form.cardId_TINID_1 = "";
        this.form.cardId_TINID_2 = "";
        this.form.cardId_TINID_3 = "";
        this.form.cardId_TINID_4 = "";
        this.form.cardId_Driver_1 = "";
        this.form.cardId_Driver_2 = "";
        this.form.cardId_Driver_3 = "";
        this.form.cardId_SSSID_1 = "";
        this.form.cardId_SSSID_2 = "";
        this.form.cardId_SSSID_3 = "";
        this.form.cardId_Postal_1 = "";
        this.form.cardId_Postal_2 = "";
        this.form.cardId_Voter_1 = "";
        this.form.cardId_Voter_2 = "";
        this.form.cardId_Voter_3 = "";
        this.form.cardId_PRC = "";
        this.form.cardId_GSIS = "";
        this.form.cardId_OWWA_1 = "";
        this.form.cardId_OWWA_2 = "";
        this.form.cardId_National_1 = "";
        this.form.cardId_National_2 = "";
        this.form.cardId_National_3 = "";
        this.form.cardId_National_4 = "";
        this.form.cardId_Philhealth_1 = "";
        this.form.cardId_Philhealth_2 = "";
        this.form.cardId_Philhealth_3 = "";
      }
      this.form.identificationType = val.IdentificationType;
      this.isVisibleIDTypePicker = false;
      this.isVisibleIDTypePickerP = false;
    },
    /**
     * toggle生日选择框
     */
    toggleBirthdayPicker() {
      if (this.readonly) {
        return;
      }
      setTimeout(() => {
        this.isVisibleBirthdayPicker = !this.isVisibleBirthdayPicker;
      }, 100);
    },
    /**
     * 选择生日
     */
    chooseBirthday(val) {
      //        this.birthDayStr = val;
      //        this.form.birthDay = dateFormat(val);
      //        this.toggleBirthdayPicker();
      this.form.birthDay = val[0] + "-" + val[1] + "-" + val[2];
      this.form.birthDayForSubmit = val[2] + "-" + val[0] + "-" + val[1];
      this.isVisibleBirthdayPicker = false;
    },
    /**
     * 获取页面数据
     */
    getData() {
      this.$api.qureyUserBaseInfo().then((res) => {
        const { status, error, data } = res;
        if (
          "1" === status &&
          ("00000000" === error || "0000" === error) &&
          data
        ) {
          const form = this.form;
          form.firstName = data.firstName;
          form.middleName = data.middleName;
          form.lastName = data.lastName;
          form.birthDay = dateFormat(data.birthDay, "MM-dd-yyyy");
          form.birthDayForSubmit = dateFormat(data.birthDay, "yyyy-MM-dd");
          form.sex = data.sex;
          form.identificationType = data.identificationType;
          form.cardId = data.cardId;
          this.oldPhone = data.cardId;

          if (data.identificationType === "UMID (Unified Multi-Purpose ID)") {
            form.cardId_UMID_1 = data.cardId.substr(0, 4);
            form.cardId_UMID_2 = data.cardId.substr(4, 7);
            form.cardId_UMID_3 = data.cardId.substr(11, 1);
          }
          if (data.identificationType === "Passport") {
            form.cardId_Passport = data.cardId;
          }
          if (
            data.identificationType ===
            "TIN ID (Taxpayer Identification Number)"
          ) {
            form.cardId_TINID_1 = data.cardId.substr(0, 3);
            form.cardId_TINID_2 = data.cardId.substr(3, 3);
            form.cardId_TINID_3 = data.cardId.substr(6, 3);
            form.cardId_TINID_4 = data.cardId.substr(9, 6);
          }
          if (data.identificationType === "Driver’s License") {
            form.cardId_Driver_1 = data.cardId.substr(0, 3);
            form.cardId_Driver_2 = data.cardId.substr(3, 2);
            form.cardId_Driver_3 = data.cardId.substr(5, 6);
          }
          if (data.identificationType === "SSS ID (Social Security System)") {
            form.cardId_SSSID_1 = data.cardId.substr(0, 2);
            form.cardId_SSSID_2 = data.cardId.substr(2, 7);
            form.cardId_SSSID_3 = data.cardId.substr(9, 1);
          }
          if (data.identificationType === "Postal ID") {
            form.cardId_Postal_1 = data.cardId.substr(0, 12);
            form.cardId_Postal_1 = data.cardId.substr(12, 1);
          }
          if (data.identificationType === "Voter's ID") {
            form.cardId_Voter_1 = data.cardId.substr(0, 4);
            form.cardId_Voter_2 = data.cardId.substr(4, 5);
            form.cardId_Voter_3 = data.cardId.substr(9, 13);
          }
          if (
            data.identificationType ===
            "PRC ID (Professional Regulation Commission)"
          ) {
            form.cardId_PRC = data.cardId;
          }
          if (data.identificationType === "GSIS ID") {
            form.cardId_GSIS = data.cardId;
          }
          if (
            data.identificationType ===
            "OWWA ID (Overseas Workers Welfare Administration)"
          ) {
            form.cardId_OWWA_1 = data.cardId.substr(0, 8);
            form.cardId_OWWA_2 = data.cardId.substr(8, 2);
          }
          if (data.identificationType === "National ID") {
            form.cardId_National_1 = data.cardId.substr(0, 4);
            form.cardId_National_2 = data.cardId.substr(4, 4);
            form.cardId_National_3 = data.cardId.substr(8, 4);
            form.cardId_National_4 = data.cardId.substr(12, 4);
          }
          if (data.identificationType === "Philhealth ID") {
            form.cardId_Philhealth_1 = data.cardId.substr(0, 2);
            form.cardId_Philhealth_2 = data.cardId.substr(2, 9);
            form.cardId_Philhealth_3 = data.cardId.substr(11, 1);
          }

          form.cardImg = data.cardImg;
          form.cardPositiveImg = data.cardPositiveImg;
        }
      });
    },
    /**
     * 获取资料填写度
     */
    getInfoData() {
      this.$api.getDataIntegrity().then((res) => {
        const { status, error, data } = res;
        if (
          "1" === status &&
          ("00000000" === error || "0000" === error) &&
          data
        ) {
          const status = this.status;
          status.identity = data.USERBASEINFO === "1"; // 基本信息
          status.personal = data.USERPERSONALINFO === "1"; // 个人信息
          status.work = data.USERJOB === "1"; // 工作信息
          status.contact = data.USERCONTACT === "1"; // 联系人信息
          status.additional = data.USERCARDID === "1"; // 身份信息
          //旧填字不可编辑
          // if(data.USERBASEINFO === '1'&&data.USERPERSONALINFO === '1'&&data.USERJOB === '1'&&data.USERCONTACT==='1'&&data.USERCARDID === '1'){
          //   data.isEdit = '0'
          // }
          // this.readonly = this.readonly || data.isEdit === '0'; // 是否可编辑 0 不可编辑 1 可编辑
          //新填字不可编辑
          if (data.USERBASEINFO === "1") {
            this.readonly = true;
          }
        }
      });
    },
    /**
     * 跳转填资
     */
    goInformation(url) {
      const path = "/information/" + url;
      const instalment = this.instalment ? "true" : "false";
      this.$router.push({
        path,
        query: { productId: this.productId, instalment },
      });
    },
    /**
     * 表单提交
     */
    submitHandler() {
      if (this.disabledBtn) return
      // 基础信息页 - 页面 - 点击
      this.$buryPoint.action({
        eventName: 'basicInfo_submit_click',
        ...this.pageTrackerInfo
      });

      const form = this.form;
      const params = {
        firstName: form.firstName.trim(),
        middleName: form.middleName.trim(),
        lastName: form.lastName.trim(),
        realName:
          form.lastName.trim() +
          " " +
          form.firstName.trim() +
          " " +
          form.middleName.trim(),
        sex: form.sex,
        birthDay: form.birthDayForSubmit,
        identificationType: form.identificationType,
        cardImg: form.cardImg,
        cardPositiveImg: form.cardPositiveImg,
        cardId: form.cardId,
      };
      // 校验空值
      const checkParams = [
        { type: "input", ref: "form1" },
        { type: "div", ref: "divInput", value: form.birthDayForSubmit },
        { type: "radio", ref: "radios", value: form.sex },
        { type: "input", ref: "form2" },
        // { type: 'image', ref: 'cardPositiveImg', value: form.cardPositiveImg },
        // { type: 'image', ref: 'cardImg', value: form.cardImg },
      ];
      if (!this.checkForm(checkParams)) {
        this.$toast("Please complete your information");
        return;
      }
      const iDType = this.iDTypeData.filter(
        (item) => item.IdentificationType === form.identificationType
      );
      const identificationId = iDType[0].IdentificationId;
      params.identificationId = identificationId;

      // 14 UMID (Unified Multi-Purpose ID)
      if (identificationId === 14) {
        if (!validateUMID1(form.cardId_UMID_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_UMID_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_UMID_1"]);
        }

        if (!validateUMID2(form.cardId_UMID_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_UMID_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_UMID_2"]);
        }
        if (!validateUMID3(form.cardId_UMID_3)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_UMID_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_UMID_3"]);
        }
      }

      // 7 Passport
      if (identificationId === 7 && !validatePassport2(form.cardId_Passport)) {
        //this.$toast(this.$tc("plsInputRightId"));
        this.markInputIdentity(
          ["cardId_Passport"],
          this.$tc("plsInputRightId")
        );
        return;
      } else {
        this.removeMarkIdentity(["cardId_Passport"]);
      }
      // 13 TIN ID (Taxpayer Identification Number)
      if (identificationId === 13) {
        if (!validateTINID1(form.cardId_TINID_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_TINID_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_TINID_1"]);
        }
        if (!validateTINID1(form.cardId_TINID_2)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_TINID_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_TINID_2"]);
        }
        if (!validateTINID1(form.cardId_TINID_3)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_TINID_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_TINID_3"]);
        }
        if (!validateTINID2(form.cardId_TINID_4)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_TINID_4"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_TINID_4"]);
        }
      }
      // 2 Driver’s License
      if (identificationId === 2) {
        if (!validateDriver1(form.cardId_Driver_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Driver_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Driver_1"]);
        }
        if (!validateDriver2(form.cardId_Driver_2)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Driver_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Driver_2"]);
        }
        if (!validateDriver3(form.cardId_Driver_3)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Driver_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Driver_3"]);
        }
      }
      // 12 SSS ID (Social Security System)
      if (identificationId === 12) {
        if (!validateSSSID1(form.cardId_SSSID_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_SSSID_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_SSSID_1"]);
        }
        if (!validateSSSID2(form.cardId_SSSID_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_SSSID_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_SSSID_2"]);
        }
        if (!validateSSSID3(form.cardId_SSSID_3)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_SSSID_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_SSSID_3"]);
        }
      }
      // 8 Postal ID
      if (identificationId === 8) {
        if (!validatePostalID1(form.cardId_Postal_1)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Postal_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Postal_1"]);
        }
        if (!validatePostalID2(form.cardId_Postal_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Postal_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Postal_2"]);
        }
      }
      // 15 Voter's ID
      if (identificationId === 15) {
        if (!validateVoterID1(form.cardId_Voter_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Voter_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Voter_1"]);
        }
        if (!validateVoterID2(form.cardId_Voter_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Voter_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Voter_2"]);
        }
        if (!validateVoterID3(form.cardId_Voter_3)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Voter_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Voter_3"]);
        }
      }
      // 9 PRC ID (Professional Regulation Commission)
      if (identificationId === 9 && !validatePRCID(form.cardId_PRC)) {
        //this.$toast(this.$tc("plsInputRightId"));
        this.markInputIdentity(["cardId_PRC"], this.$tc("plsInputRightId"));
        return;
      } else {
        this.removeMarkIdentity(["cardId_PRC"]);
      }
      // 4 GSIS ID
      if (identificationId === 4 && !validateGSUSID(form.cardId_GSIS)) {
        //this.$toast(this.$tc("plsInputRightId"));
        this.markInputIdentity(["cardId_GSIS"], this.$tc("plsInputRightId"));
        return;
      } else {
        this.removeMarkIdentity(["cardId_GSIS"]);
      }
      // 6 OWWA ID (Overseas Workers Welfare Administration)
      if (identificationId === 6) {
        if (!validateOWWAID1(form.cardId_OWWA_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_OWWA_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_OWWA_1"]);
        }
        if (!validateOWWAID2(form.cardId_OWWA_2)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_OWWA_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_OWWA_2"]);
        }
      }
      // 16 National ID
      if (identificationId === 16) {
        if (!validateNationalID(form.cardId_National_1)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_National_1"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_National_1"]);
        }
        if (!validateNationalID(form.cardId_National_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_National_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_National_2"]);
        }
        if (!validateNationalID(form.cardId_National_3)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_National_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_National_3"]);
        }
        if (!validateNationalID(form.cardId_National_4)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_National_4"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_National_4"]);
        }
      }
      // 17 Philhealth ID
      if (identificationId === 17) {
        if (!validatePhilhealthID1(form.cardId_Philhealth_1)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(["cardId_Philhealth_1"]);
          return;
        } else {
          this.removeMarkIdentity(["cardId_Philhealth_1"]);
        }
        if (!validatePhilhealthID2(form.cardId_Philhealth_2)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Philhealth_2"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Philhealth_2"]);
        }
        if (!validatePhilhealthID3(form.cardId_Philhealth_3)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Philhealth_3"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Philhealth_3"]);
        }
      }

      switch (identificationId) {
        case 14:
          params.cardId =
            form.cardId_UMID_1 + form.cardId_UMID_2 + form.cardId_UMID_3;
          break;
        case 7:
          params.cardId = form.cardId_Passport;
          break;
        case 13:
          params.cardId =
            form.cardId_TINID_1 +
            form.cardId_TINID_2 +
            form.cardId_TINID_3 +
            form.cardId_TINID_4;
          break;
        case 2:
          params.cardId =
            form.cardId_Driver_1 + form.cardId_Driver_2 + form.cardId_Driver_3;
          break;
        case 12:
          params.cardId =
            form.cardId_SSSID_1 + form.cardId_SSSID_2 + form.cardId_SSSID_3;
          break;
        case 8:
          params.cardId = form.cardId_Postal_1 + form.cardId_Postal_2;
          break;
        case 15:
          params.cardId =
            form.cardId_Voter_1 + form.cardId_Voter_2 + form.cardId_Voter_3;
          break;
        case 9:
          params.cardId = form.cardId_PRC;
          break;
        case 4:
          params.cardId = form.cardId_GSIS;
          break;
        case 6:
          params.cardId = form.cardId_OWWA_1 + form.cardId_OWWA_2;
          break;
        case 16:
          params.cardId =
            form.cardId_National_1 +
            form.cardId_National_2 +
            form.cardId_National_3 +
            form.cardId_National_4;
          break;
        case 17:
          params.cardId =
            form.cardId_Philhealth_1 +
            form.cardId_Philhealth_2 +
            form.cardId_Philhealth_3;
          break;
        default:
          params.cardId = "";
      }

      // if (form.identificationType === 'Postal ID') {
      //   params.cardId = form.cardId1 + form.cardId2;
      // }
      // if (form.identificationType === 'Voter\'s ID') {
      //   params.cardId = form.cardId3 + form.cardId4 + form.cardId5;
      // }

      if (!validateName(params.lastName)) {
        //this.$toast(this.$t("plsInputRight") + " last name");
        this.markInputIdentity(
          ["lastName"],
          this.$t("plsInputRight") + " last name"
        );
        return;
      } else {
        this.removeMarkIdentity(["lastName"]);
      }
      if (!validateName(params.firstName)) {
        //this.$toast(this.$t("plsInputRight") + " first name");
        this.markInputIdentity(
          ["firstName"],
          this.$t("plsInputRight") + " first name"
        );
        return;
      } else {
        this.removeMarkIdentity(["firstName"]);
      }
      if (!validateName(params.middleName)) {
        //this.$toast(this.$t("plsInputRight") + " middle name");
        this.markInputIdentity(
          ["middleName"],
          this.$t("plsInputRight") + " middle name"
        );
        return;
      } else {
        this.removeMarkIdentity(["middleName"]);
      }
      this.disabledBtn = true;
      this.$api
        .addOrUpdateUserBaseInfo(params)
        .then((res) => {
          const { status, error, msg } = res;
          if ("1" === status && ("00000000" === error || "0000" === error)) {
            // 基础信息页 - 页面 - 成功
            this.$buryPoint.action({
              eventName: 'basicInfo_submit_success',
              ...this.pageTrackerInfo
            });
            this.$refs.checkFaceInfo.returnTo().catch(() => {
              this.disabledBtn = false;
            });
           
          } else {
            this.disabledBtn = false
            this.$toast(msg);
          }
        })
        .catch((error) => {
          this.disabledBtn = false;
        });
    },
    scrollIntoView(name) {
      const ua = navigator.userAgent;
      const isAndroid = ua.indexOf("Android") > -1 || ua.indexOf("Adr") > -1;
      if (isAndroid) {
        const dom = this.$refs[name];
        setTimeout(() => {
          dom.scrollIntoView(true);
          dom.scrollIntoViewIfNeeded();
        }, 300);
      }
    },
    choseGender(type) {
      if (this.readonly) {
        return;
      }
      this.form.sex = type;
    },

    changeCardID(type, length, curInputIdx, nextInput = true) {
      const Map = {
        14: "UMID",
        13: "TINID",
        2: "Driver",
        12: "SSSID",
        8: "Postal",
        15: "Voter",
        6: "OWWA",
        16: "National",
        17: "Philhealth",
      };

      if (
        nextInput &&
        this.form[`cardId_${Map[type]}_${curInputIdx}`].length >= length
      ) {
        this.$refs[`cardId_${Map[type]}_${curInputIdx + 1}`].focus();

        // let input = this.$refs[`cardId_${Map[type]}_${curInputIdx + 1}`];
        // input.focus();
        // input.setSelectionRange(100, 100);
        // setTimeout(() => input.setSelectionRange(100, 100), 10);
      }
      // if (curInputIdx > 1 && this.form[`cardId_${Map[type]}_${curInputIdx}`].length === 0) {
      //   let input = this.$refs[`cardId_${Map[type]}_${curInputIdx - 1}`];
      //   input.focus();
      //   // input.setSelectionRange(100, 100);
      //   setTimeout(() => input.setSelectionRange(100, 100), 10);
      // }

      // const form = this.form;
      // if (form.identificationType === 'Postal ID' && form.cardId1.length >= 12) {
      //   this.$refs.cardId2.focus();
      // }
      // if (form.identificationType === 'Voter\'s ID' && form.cardId3.length >= 4) {
      //   this.$refs.cardId4.focus();
      // }
    },

    initBirthdayData() {
      const min = Number(dateFormat(new Date().getTime(), "yyyy")) - 60;
      const max = Number(dateFormat(new Date().getTime(), "yyyy")) - 10;
      const birthdayData = [];
      for (let i = min; i <= max; i++) {
        birthdayData.push(i);
      }
      const obj = {
        values: birthdayData,
        className: "column3",
      };
      this.birthdayData.push(obj);
    },
    change(e) {
      const value = e.target.value;
      if (this.oldPhone == "" || this.oldPhone.length < value.length) {
        this.oldPhone = value;
      }
      if (this.newOldPhone.length < value.length && this.isChangePhone) {
        this.isChangePhone = false;
        console.warn(
          this.oldPhone.substr(this.newOldPhone.length, this.oldPhone.length)
        );
        // this.$hybrid.action('ee', {
        //   content: 'id_page_id_fill_delete',
        //   value: this.oldPhone.substr(this.newOldPhone.length, this.oldPhone.length)
        // });
        this.oldPhone = value;
      }
      if (value.length < this.oldPhone.length) {
        this.newOldPhone = value;
        this.isChangePhone = true;
      }
    },
    // 聚焦
    IdFocus(e) {
      const params = {
        content: "id_page_id_fill_start",
        value: "",
      };
      // this.$hybrid.action('ee', {
      //   ...params
      // });
    },
    // 取消聚焦
    IdBlur(e) {
      const params = {
        content: "id_page_id_fill_end",
        value: e.target.value,
      };
      if (
        this.newOldPhone.length < this.oldPhone.length &&
        this.isChangePhone
      ) {
        this.isChangePhone = false;
        console.warn(
          this.oldPhone.substr(this.newOldPhone.length, this.oldPhone.length)
        );
        // this.$hybrid.action('ee', {
        //   content: 'id_page_id_fill_delete',
        //   value: this.oldPhone.substr(this.newOldPhone.length, this.oldPhone.length)
        // });
      }
      // this.$hybrid.action('ee', {
      //   ...params
      // });
    },

    /* lastName 验证 */
    nameBlur(key) {
      const form = this.form;
      const name = form[key];
      if (!validateName(name)) {
        //this.$toast(this.$t("plsInputRight") + map[key]);
        this.markInputNew([key]);
        return;
      } else {
        this.removeMarkClick([key]);
      }
    },
    idCardUploadTracker () {
      // 基础信息页证件号码上传
      this.$buryPoint.action({
        eventName: 'basicInfo_IDType_upload',
        ...this.pageTrackerInfo
      });
    },
    /* idCard 验证 */
    idCardBlur(index) {
      const form = this.form;
      const iDType = this.iDTypeData.filter(
        (item) => item.IdentificationType === form.identificationType
      );
      const identificationId = iDType[0].IdentificationId;
      // UMID 
      if (identificationId === 14) {
        if (index === 1) {
          if (!validateUMID1(form.cardId_UMID_1)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_UMID_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_UMID_1"]);
          }
        }
        if (index === 2) {
          if (!validateUMID2(form.cardId_UMID_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_UMID_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_UMID_2"]);
          }
        }
        if (index === 3) {
          this.idCardUploadTracker()
          if (!validateUMID3(form.cardId_UMID_3)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_UMID_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_UMID_3"]);
          }
        }
      }
      // passport
      if (identificationId === 7) {
        this.idCardUploadTracker()
        if (!validatePassport2(form.cardId_Passport)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(
            ["cardId_Passport"],
            this.$tc("plsInputRightId")
          );
          return;
        } else {
          this.removeMarkIdentity(["cardId_Passport"]);
        }
      }
      // TINID
      if (identificationId === 13) {
        if (index === 1) {
          if (!validateTINID1(form.cardId_TINID_1)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_TINID_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_TINID_1"]);
          }
        }

        if (index === 2) {
          if (!validateTINID1(form.cardId_TINID_2)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_TINID_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_TINID_2"]);
          }
        }

        if (index === 3) {
          if (!validateTINID1(form.cardId_TINID_3)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_TINID_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_TINID_3"]);
          }
        }

        if (index === 4) {
          this.idCardUploadTracker()
          if (!validateTINID2(form.cardId_TINID_4)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_TINID_4"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_TINID_4"]);
          }
        }
      }
      // Driver
      if (identificationId === 2) {
        if (index === 1) {
          if (!validateDriver1(form.cardId_Driver_1)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Driver_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Driver_1"]);
          }
        }

        if (index === 2) {
          if (!validateDriver2(form.cardId_Driver_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Driver_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Driver_2"]);
          }
        }

        if (index === 3) {
          this.idCardUploadTracker()
          if (!validateDriver3(form.cardId_Driver_3)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Driver_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Driver_3"]);
          }
        }
      }
      // sss ID
      if (identificationId === 12) {
        if (index === 1) {
          if (!validateSSSID1(form.cardId_SSSID_1)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_SSSID_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_SSSID_1"]);
          }
        }

        if (index === 2) {
          if (!validateSSSID2(form.cardId_SSSID_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_SSSID_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_SSSID_2"]);
          }
        }

        if (index === 3) {
          this.idCardUploadTracker()
          if (!validateSSSID3(form.cardId_SSSID_3)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_SSSID_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_SSSID_3"]);
          }
        }
      }
      // Postal ID Number
      if (identificationId === 8) {
        if (index === 1) {
          if (!validatePostalID1(form.cardId_Postal_1)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Postal_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Postal_1"]);
          }
        }

        if (index === 2) {
          this.idCardUploadTracker()
          if (!validatePostalID2(form.cardId_Postal_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Postal_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Postal_2"]);
          }
        }
      }
      // Voters ID
      if (identificationId === 15) {
        if (index === 1) {
          if (!validateVoterID1(form.cardId_Voter_1)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Voter_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Voter_1"]);
          }
        }

        if (index === 2) {
          if (!validateVoterID2(form.cardId_Voter_2)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Voter_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Voter_2"]);
          }
        }

        if (index === 3) {
          this.idCardUploadTracker()
          if (!validateVoterID3(form.cardId_Voter_3)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Voter_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Voter_3"]);
          }
        }
      }
      // PRC ID
      if (identificationId === 9) {
        this.idCardUploadTracker()
        if (!validatePRCID(form.cardId_PRC)) {
          //this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(["cardId_PRC"], this.$tc("plsInputRightId"));
        } else {
          this.removeMarkIdentity(["cardId_PRC"]);
        }
      }
      // GIS
      if (identificationId === 4) {
        this.idCardUploadTracker()
        if (!validateGSUSID(form.cardId_GSIS)) {
          // this.$toast(this.$tc("plsInputRightId"));
          this.markInputIdentity(["cardId_GSIS"], this.$tc("plsInputRightId"));
        } else {
          this.removeMarkIdentity(["cardId_GSIS"]);
        }
      }
      // owwa id
      if (identificationId === 6) {
        if (index === 1) {
          if (!validateOWWAID1(form.cardId_OWWA_1)) {
            // this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_OWWA_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_OWWA_1"]);
          }
        }
        if (index === 2) {
          this.idCardUploadTracker()
          if (!validateOWWAID2(form.cardId_OWWA_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_OWWA_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_OWWA_2"]);
          }
        }
      }
      // national id
      if (identificationId === 16) {
        if (index === 1) {
          if (!validateNationalID(form.cardId_National_1)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_National_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_National_1"]);
          }
        }

        if (index === 2) {
          if (!validateNationalID(form.cardId_National_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_National_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_National_2"]);
          }
        }

        if (index === 3) {
          if (!validateNationalID(form.cardId_National_3)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_National_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_National_3"]);
          }
        }

        if (index === 4) {
          this.idCardUploadTracker()
          if (!validateNationalID(form.cardId_National_4)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_National_4"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_National_4"]);
          }
        }
      }
      if (identificationId === 17) {
        if (index === 1) {
          if (!validatePhilhealthID1(form.cardId_Philhealth_1)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Philhealth_1"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Philhealth_1"]);
          }
        }

        if (index === 2) {
          if (!validatePhilhealthID2(form.cardId_Philhealth_2)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Philhealth_2"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Philhealth_2"]);
          }
        }

        if (index === 3) {
          this.idCardUploadTracker()
          if (!validatePhilhealthID3(form.cardId_Philhealth_3)) {
            //this.$toast(this.$tc("plsInputRightId"));
            this.markInputIdentity(
              ["cardId_Philhealth_3"],
              this.$tc("plsInputRightId")
            );
          } else {
            this.removeMarkIdentity(["cardId_Philhealth_3"]);
          }
        }
      }
    },
  },
  created() {
    this.initBirthdayData();
    // this.$hybrid.action("pageName", {
    //   value: "identity",
    // });

    const query = this.$route.query;
    this.productId = query.productId;
    if (query.btnType && query.btnType === "save") {
      // 按钮是下一步，还是保存
      this.btnName = this.$t("save");
    }
    this.readonly = query.readonly === "true";
    this.instalment = query.instalment === "true";
    this.getInfoData();
    this.getData();

  },
  mounted () {
    this.pageStartAction()
    // 基础信息页 - 页面 - 曝光
    this.$buryPoint.action({
      eventName: 'basicInfo_page_show',
      ...this.pageTrackerInfo
    });
  },
  beforeDestroy () {
    this.pageEndAction()
  },
};
